<!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
      <title>购物车</title>
      <script src="../static/shopping.js"></script>
      <style>
          body{
            margin: 0;
            padding: 0;
            min-height: 100vh;
            background: url("../static/car.jpeg") no-repeat center;
            background-size: 100% 100%;
            overflow: hidden;
        }
      	table{
    width:50%;
    position:relative;
    margin:30px auto;
    border-collapse: collapse;
    border:1px solid gray;
      }
th{
    background: cornflowerblue;
    height:2.5em;
   }
    .tdone{
        width:10%;
        }
    .tdtwo{
         width:20%;
    }
    .tdthree{
         width:20%;
     }
     .tdfour{
         width:20%;
              }
     .tdfive{
        width:20%;
    }
     .tdsix{
         width:10%;
     }
  td{
        height:2em;
          text-align: center;
         border:1px solid #ccc;
     }
     .num{
         display:inline-block;
        width:3em;
    }
 input{
        height:2em;
    }
    .talast{
        text-align: left;
    }



      </style>

  </head>
  <body>
     <table>
         <thead>
             <tr>
                 <th class="tdone">序号</th>
                 <th class="tdtwo">商品名称</th>
                 <th class="tdthree">数量</th>
                 <th class="tdfour">单价</th>
                 <th class="tdfive">小计</th>
                 <th class="tdsix">操作</th>
             </tr>
         </thead>
                  <tbody>
             <tr class="trclass">
                 <td class="tdone xuhao">1</td>
                 <td class="tdtwo ">铁板豆腐</td>
                 <td class="tdthree"><span class="jiajie"><input type="button" value="-"><span class="num">0</span><input type="button" value="+"></span></td>
                 <td class="tdfour"><span>单价：</span><span class="unit">4</span></td>
                 <td class="tdfive"><span>小计：</span><span class="subtal">0</span></td>
                 <td class="tdsix"><button class="del">删除</button></td>
             </tr>
               <tr class="trclass">
                 <td class="tdone xuhao">2</td>
                 <td class="tdtwo">雪糕</td>
                 <td class="tdthree"><span class="jiajie"><input type="button" value="-"><span class="num">0</span><input type="button" value="+"></span></td>
                 <td class="tdfour"><span>单价：</span><span class="unit">5</span></td>
                 <td class="tdfive"><span>小计：</span><span class="subtal">0</span></td>
                 <td class="tdsix"><button class="del">删除</button></td>
             </tr>
               <tr class="trclass">
                 <td class="tdone xuhao">3</td>
                 <td class="tdtwo">粤利粤</td>
                 <td class="tdthree"><span class="jiajie"><input type="button" value="-"><span class="num">0</span><input type="button" value="+"></span></td>
                 <td class="tdfour"><span>单价：</span><span class="unit">7</span></td>
                 <td class="tdfive"><span>小计：</span><span class="subtal">0</span></td>
                 <td class="tdsix"><button class="del">删除</button></td>
             </tr>
               <tr>
                 <td class="tdone xuhao">4</td>
                 <td class="tdtwo">卫龙</td>
                 <td class="tdthree"><span class="jiajie"><input type="button" value="-"><span class="num">0</span><input type="button" value="+"></span></td>
                 <td class="tdfour"><span>单价：</span><span class="unit">1</span></td>
                 <td class="tdfive"><span>小计：</span><span class="subtal">0</span></td>
                 <td class="tdsix"><button class="del">删除</button></td>
             </tr>
               <tr class="trclass">
                 <td class="tdone xuhao">5</td>
                 <td class="tdtwo">大白免</td>
                 <td class="tdthree"><span class="jiajie"><input type="button" value="-"><span class="num">0</span><input type="button" value="+"></span></td>
                 <td class="tdfour"><span>单价：</span><span class="unit">3</span></td>
                 <td class="tdfive"><span>小计：</span><span class="subtal">0</span></td>
                 <td class="tdsix"><button class="del">删除</button></td>
             </tr>
              <tr class="trclass">
                 <td class="tdone xuhao">6</td>
                 <td class="tdtwo">冰绿茶</td>
                 <td class="tdthree"><span class="jiajie"><input type="button" value="-"><span class="num">0</span><input type="button" value="+"></span></td>
                 <td class="tdfour"><span>单价：</span><span class="unit">5</span></td>
                 <td class="tdfive"><span>小计：</span><span class="subtal">0</span></td>
                 <td class="tdsix"><button class="del">删除</button></td>
             </tr>
              <tr class="trclass">
                 <td class="tdone xuhao">7</td>
                 <td class="tdtwo">瓜子</td>
                 <td class="tdthree"><span class="jiajie"><input type="button" value="-"><span class="num">0</span><input type="button" value="+"></span></td>
                 <td class="tdfour"><span>单价：</span><span class="unit">5</span></td>
                 <td class="tdfive"><span>小计：</span><span class="subtal">0</span></td>
                 <td class="tdsix"><button class="del">删除</button></td>
             </tr>
             <tr><td   colspan="6"; class="talast"><span>商品一共 <span class="goods_num">0</span> 件; 共计花费 <span class="pricetal">0</span> 元; 其中最贵的商品单价是 <span class="pricest">0</span> 元</span></td></tr>
         </tbody>
     </table>
 </body>
 </html>